import { useEffect, useState } from 'react'
import { Modal, List, SwipeAction, Toast } from 'antd-mobile'
import { userPage, userSave, userDel } from '@api'
import './index.scss'

const avatar = 'https://pzdsoss.pzds.com/user/head/20231017/20231017/7hnxBx'

const Meeting = () => {
    const [list, setList] = useState([])

    useEffect(() => {
        getData()
    }, [])

    const getData = () => {
        userPage({ current: 1, size: 100 }).then(({ data, info, success }) => {
            if (success && data) {
                setList(data.records.filter((e) => e.level !== 0))
            } else {
                Toast.show(info)
            }
        })
    }

    const getActions = (item) => {
        return [
            {
                userId: item.id,
                key: 'status',
                text: item.status === 'DISABLED' ? '启用' : '禁用',
                color: item.status === 'DISABLED' ? 'success' : 'warning',
                value: item.status
            },
            {
                userId: item.id,
                key: 'delete',
                text: '删除',
                color: 'danger'
            }
        ]
    }

    const onAction = ({ userId, key, value }) => {
        switch (key) {
            case 'status':
                userSave({ id: userId, status: value === 'DISABLED' ? 'ENABLED' : 'DISABLED' }).then(({ info, success }) => {
                    if (success) {
                        Toast.show('操作成功~')
                        getData()
                    } else {
                        Toast.show(info)
                    }
                })
                break
            case 'delete':
                Modal.confirm({
                    title: '确认操作',
                    content: '您确定要删除此账号吗？',
                    confirmText: '确认',
                    cancelText: '取消',
                    onConfirm: () => {
                        userDel(userId).then(({ info, success }) => {
                            if (success) {
                                Toast.show('操作成功~')
                                getData()
                            } else {
                                Toast.show(info)
                            }
                        })
                    }
                })

                break
            default:
                break
        }
    }

    return (
        <div className="Meeting">
            <List>
                {list.map((item) => (
                    <SwipeAction key={item.id} rightActions={getActions(item)} onAction={onAction}>
                        <List.Item description={item.createTime}>
                            <p style={{ fontWeight: 'bold', fontFamily: '黑体' }}>
                                {item.name}（{item.phone}）
                            </p>
                        </List.Item>
                    </SwipeAction>
                ))}
            </List>
        </div>
    )
}
export default Meeting
